<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>首页</title>


<link rel="stylesheet" href="css/bootstrap.css" />
<script src="js/jquery-3.4.1.js" type="text/javascript"></script>
<script src="js/bootstrap.js" type="text/javascript"></script>
<style>
body {
	overflow-x: hidden;
}

iframe {
	margin-top: 20px;
}

.header {
	padding:10px;
}
</style>

<script>
	//function fu() {
		//document.getElementById('iframe').height = docuemnt.body.ScrollHeight;
	//}

	function switchNav(which) {

		href_1 = document.getElementById("href_1")
		href_2 = document.getElementById("href_2")
		href_3 = document.getElementById("href_3")

		switch (which) {
		case 1:
			href_1.className = "active"
			href_2.className = ""
			href_3.className = ""
			break;
		case 2:
			href_1.className = ""
			// href_1.removeAttribute("class")
			href_2.className = "active"
			href_3.className = ""
			break;
		case 3:
			href_1.className = ""
			href_2.className = ""
			href_3.className = "active"
			break;
		}
	}
	

</script>

</head>
<body>


	<div class="container ">
		<div class="header">
			<ul class="nav nav-pills">
				<li role="presentation" class="active" id="href_1">
				<!-- target 目标，点击a表会跳转到href对应的地址，在哪里显示呢？
				在a标签对应的target目标中显示，此处的target对应的名称是main，
				main又是iframe的name属性值，则a标签跳转的地址显示都会在main对应的iframe中
				
				 -->
				    <a href="/car/CarInfoServlet" target="main" onclick="switchNav(1)">汽车详情</a>
				</li>
				<li id="href_2" role="presentation">
				    <a href="about.jsp" target="main" onclick="switchNav(2)">关于我们</a>
				</li>
				<li id="href_3" role="presentation">
				     <a href="sys.jsp" target="main" onclick="switchNav(3)">系统介绍</a>
				</li>

                <!-- float：浮动  right ： 右边   向右边浮动-->
			 	<li role="presentation" style="float: right; font-size: 18px;line-height:40px; font-weight: 500">
			 	   
			 	    <a target="main" href="add.jsp" style="display:inline-block;width:33px; height:33px;margin-right:24px;line-height:33px">
			 	        <img src="img/add.png" style="width:33px; height:33px; line-height:33px"/>
			 	    </a> 
			 	    欢迎您:<span><%=session.getAttribute("name")%><span>
			 	    
			 	</li>

			</ul>

		</div>

	</div>

	 <div class="embed-responsive embed-responsive-16by9"> 
		<!-- scrolling=no  当页面加载到iframe的时候，就会去请求src对应的地址-->
		<iframe id="iframe"  name="main"
			src="/car/CarInfoServlet" class="embed-responsive-item" scrolling=auto
			frameborder=no>
	
       </iframe>
	
 </div> 

</body>
</html>